import React, {Component} from 'react';
import {Table, Tag} from 'antd';
import axios from "axios";
import {CheckOutlined, CloseOutlined, WarningOutlined,} from '@ant-design/icons';

const columns = [
    {
        title: '投诉编号',
        dataIndex: 'id',
        key: 'id',
        // eslint-disable-next-line
        render: text => <a>{text}</a>,
    },
    {
        title: '投诉日期',
        dataIndex: 'createTime',
        key: 'createTime',
    },
    {
        title: '投诉对象',
        dataIndex: 'complainantTypeStr',
        key: 'complainantTypeStr',
    },
    {
        title: '被投诉对象',
        dataIndex: 'complaintObject',
        key: 'complaintObject',
    },
    {
        title: '投诉事项',
        dataIndex: 'problemCategoryStr',
        key: 'problemCategoryStr',
    },
    {
        title: '状态',
        key: 'stateStr',
        dataIndex: 'stateStr',
        render: (text, row, index) => {
            let color = 'green'
            let icon = <CheckOutlined />
            if (row.state === 'PENDING') {
                color = 'geekblue'
                icon = <WarningOutlined />
            } else if (row.state === 'NOT_ACCEPTED') {
                color = 'volcano'
                icon = <CloseOutlined/>
            }
            return (
                <Tag icon={icon} color={color} key={row.id}>
                    {text}
                </Tag>
            )
        }

    },
];

const requestData = {
    "data": {
        "complainantType": null,
        "createTime": "",
        "problemCategory": null,
        "state": null,
        "workOrder": ""
    },
    "limit": 10,
    "page": 1
}

class Complaint extends Component {

    state = {
        "pageData": {
            "code": 0,
            "data": {
                "pages": 0,
                "records": [
                    {
                        "complainantType": "",
                        "complainantTypeStr": "",
                        "complaintObject": "",
                        "complaintUnit": "",
                        "createTime": "",
                        "id": "",
                        "problemCategory": "",
                        "problemCategoryStr": "",
                        "respondent": "",
                        "respondentPosition": "",
                        "respondentType": "",
                        "state": "",
                        "stateStr": "",
                        "workOrder": ""
                    }
                ],
                "size": 0,
                "total": 0
            },
            "message": ""
        }
    };

    componentWillMount() {
        axios.post('complaint/complaintInfo/listComplaintInfo',
            {data: requestData},
            {headers: {'token': 'eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiIwMDAwMDAwMC0wMDAwLTAwMDAtMDAwMC0wMDAwMDAwMDAwMDAiLCJpYXQiOjE2MzI5MDU5NjEsImV4cCI6MTYzMjkwOTU2MX0.JVAOygl3LoCYuPpzLye36OIAvlIo-4FHGdL3Fpo2SSzV0N0khaHumRZ56-mkaKz7eNvQKlfq0qpmyC-qzhTDbg'}}).then(
            response => {
                this.setState({pageData: response.data})
            },
            error => {
                console.log('FAIL', error);
            }
        )
    }

    render() {
        return (
            <div>
                <Table dataSource={this.state.pageData.data.records} columns={columns}/>
            </div>
        );
    }
}

export default Complaint;